<template>
  <div>
    <el-card>
      <el-select v-model="attendanceItemId" placeholder="请选考核" @change="attendaceItemChange">
        <el-option
          v-for="item in attendanceItems"
          :key="item.id"
          :label="item.attendanceTime"
          :value="item.id"
        ></el-option>
      </el-select>

      <el-table :data="attendaceEmpTable" style="width: 100%;margin-top:2px;">
        <el-table-column prop="attendanceTime" label="考核月份"></el-table-column>
        <el-table-column prop="stutasStr" label="考核阶段"></el-table-column>
        <el-table-column prop="empName" label="姓名"></el-table-column>
        <el-table-column prop="empStatuStr" label="绩效填写状态"></el-table-column>
        <el-table-column prop="score" label="分数"></el-table-column>
        <el-table-column label="操作" width="230px">
          <template slot-scope="scope">
            <el-button
              type="text"
              size="small"
              v-if="scope.row.stutas==3 && scope.row.empStatus==5"
              @click="openMarkLeaderPage(scope.row.id,scope.row.empId,scope.row.attEmpId)"
            >考核</el-button>
            <el-button
              type="text"
              size="small"
              @click="showAllCommits(scope.row.id,scope.row.empId)"
            >查看月计划/绩效</el-button>
            <!-- <el-button type="text" size="small" @click="OpenTempldate">考核模板</el-button> -->
          </template>
        </el-table-column>
      </el-table>
    </el-card>

    <!--考核-->
    <el-dialog title="考核" :visible.sync="dialogMarkLeaderVisible" width="45%">
      <el-form label-width="180px" ref="markLeaderForm" :model="markLeaderForm">
        <div v-for="(item,index) in markLeaderForm.tempItems" :key="index">
          <el-form-item
            :label="item.attendanceItemName+'(自评:'+item.selfScore+')'"
            :prop="'tempItems.'+index+'.leaderScore'"
            :rules="{required:true,message:'分数必填',trigger:'blur'}"
          >
            <el-input-number
              v-model="item.leaderScore"
              :precision="2"
              :step="5"
              :max="100"
              :min="0"
            ></el-input-number>
          </el-form-item>
        </div>
        <el-form-item>
          <el-button type="primary" :disabled="saveMarkLeaderBtn" @click="saveMarkLeader">保存</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data() {
    return {
      corpId: null,
      departId: null, //部门id
      //......................下拉数据
      attendanceItemId: null, //考核id
      attendanceItems: null,
      //......................table数据
      attendaceEmpTable: null,
      //......................考核数据
      dialogMarkLeaderVisible: false,
      saveMarkLeaderBtn: false,
      attendanceEmpId: null, //人员考核id
      markLeaderForm: {
        tempItems: [{ id: null, attendanceItemName: null, score: null }]
      }
    };
  },
  created: function() {
    this.getJsApiTeckit();
  },
  methods: {
    //获取签名
    async getJsApiTeckit() {
      var result = await this.$httpd.get("/DingDingSecurity/GetJsapiTicket");
      if (result.status != 200) {
        this.$message.error("获取钉钉信息出错");
        return;
      }
      this.corpId = result.data.corpId;
      this.getCodeForDepartInfo(this.corpId);
    },
    //先获取免登code
    getCodeForDepartInfo(corpId) {
      var that = this;
      that.$dd.ready(() => {
        that.$dd.runtime.permission.requestAuthCode({
          corpId: corpId, // 企业id
          onSuccess: function(info) {
            that.getDepartByCode(info.code);
          }
        });
      });
    },
    //根据code获取部门id
    async getDepartByCode(code) {
      var result = await this.$httpd.get(
        `/EmpSalary/GetdepartmentById?code=${code}`
      );
      if (result.status != 200) {
        this.$message.error("获取部门数据出错");
        return;
      }
      var departId = result.data.isAdmin
        ? result.data.id
        : result.data.parentid;
      this.getAttendanceItems(departId);
    },
    //获取下拉菜单数据
    async getAttendanceItems(departId) {
      var result = await this.$httpd.get(
        `/AttendanceItem/QueryAttendanceItems?dePartId=${departId}`
      );
      if (result.status != 200 || result.data.returnStatus == 0) {
        this.$message.error(result.data.message);
        return;
      }
      this.attendanceItems = result.data.data;
      this.attendanceItemId = this.attendanceItems[0].id;
      this.getCodeForAttendanceEmpByDepartId();
    },
    //获取考核管理列表需要的code
    getCodeForAttendanceEmpByDepartId() {
      var that = this;
      that.$dd.ready(() => {
        that.$dd.runtime.permission.requestAuthCode({
          corpId: that.corpId, // 企业id
          onSuccess: function(info) {
            that.getAttendanceEmpByDepartIdAndAttItemId(info.code);
          }
        });
      });
    },
    //获取列表数据
    async getAttendanceEmpByDepartIdAndAttItemId(code) {
      var result = await this.$httpd.get(
        `/AttendanceEmp/QueryAttendanceEmpByDepartId?code=${code}&attendanceItemId=${this.attendanceItemId}`
      );
      if (result.status != 200 || result.data.returnStatus == 0) {
        this.$message.error(result.data.message);
        return;
      }
      this.attendaceEmpTable = result.data.data;
    },
    //下拉菜单数据变化
    attendaceItemChange() {
      this.getCodeForAttendanceEmpByDepartId();
    },
    //查看绩效
    showAllCommits(itemId, empId) {
      this.$router.push({
        name: "attendanceCommitAll",
        params: {
          eid: empId,
          attendanceId: itemId
        }
      });
    },
    //打开考核页面
    async openMarkLeaderPage(attendanceItemId, empId, attendanceEmpId) {
      this.dialogMarkLeaderVisible = true;
      this.saveMarkLeaderBtn = false;
      this.attendanceEmpId = attendanceEmpId;

      var result = await this.$httpd.get(
        `/AttendanceEmpResultAdd/QueryAttendanceResultByEmpId?empid=${empId}&itemId=${attendanceItemId}`
      );
      if (result.status != 200 || result.data.returnStatus == 0) {
        this.$message.error(result.data.message);
        return;
      }
      this.markLeaderForm.tempItems = result.data.data;
    },
    saveMarkLeader() {
      this.$refs.markLeaderForm.validate(async v => {
        if (v) {
          this.saveMarkLeaderBtn = true;
          var markLeaderData = { attEmpid: this.attendanceEmpId, updates: [] };
          this.markLeaderForm.tempItems.forEach(e => {
            markLeaderData.updates.push({
              id: e.id,
              leaderScore: e.leaderScore
            });
          });

          var result = await this.$httpd.post(
            "/AttendanceEmpResultAdd/Update",
            markLeaderData
          );
          if (result.status != 200 || result.data.returnStatus == 0) {
            this.$message.error(result.data.message);
            return;
          }
          this.dialogMarkLeaderVisible = false;
          this.getCodeForAttendanceEmpByDepartId();
          this.$message.success({
            message: result.data.message,
            type: "success"
          });
        }
      });
    }
  }
};
</script>